import { create } from 'zustand'
import { persist, createJSONStorage } from 'zustand/middleware'
import { createSelectors } from './auto-generate-selector'

interface ThemeState {
  theme: string
  changeTheme: () => void
}

const useThemeStoreBase = create<ThemeState>()(persist((set, get) => ({
  theme: 'light',
  changeTheme: () => set((state) => ({ theme: state.theme === 'light' ? 'dark' : 'light' })),
}), {
  name: 'theme',
}))

const useThemeStore = createSelectors(useThemeStoreBase)

export default useThemeStore